<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://cdn.staticfile.org/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <style>

        html {
            filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
            -webkit-filter: grayscale(100%);
        }
        #select {
            background-color: rgb(24,114,169);
            border: none;
            color: white;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 10px;

            cursor: pointer;

        }

    </style>
</head>
<body>
<div>
    <h2>请输入用户名：</h2>
    <input name="userName" id="userName" type="text" />
    <input type="button" onclick="getBorInfo()" id="select" value="查询">
</div>
<div>
    <table   class="table">
        <thead>
        <th style="display: none"></th>
        <th>用户名</th>
        <th>邮箱</th>
        <th>身份证</th>
        <th>电话号码</th>
        <th>余额</th>
        <th>创建日期</th>
        </thead>
        <tbody id="userInfo">

        </tbody>
    </table>
</div>
</body>
</html>

<script src="/js/jquery-3.5.1.js"></script>
<script>

    function getBorInfo() {
        $.get("/getBorInfo.admin",{userName:$("#userName").val()},function (responseText) {
            $("#userInfo").empty();
            if (responseText.length <= 2) {
                $("#userInfo").append("<tr ><td colspan='6' style='text-align: center; ' >无</td></tr>");
                return;
            }
            let borObj = JSON.parse(responseText);
            for (let i = 0; i < borObj.length; i++) {
                let str = "<td style='display: none'>" + borObj[i].userId + "</td>>";
                str += "<td>" + borObj[i].userName + "</td>>";
                str += "<td>" + borObj[i].email + "</td>>";
                str += "<td>" + borObj[i].idCard + "</td>>";
                str += "<td>" + borObj[i].phone + "</td>>";
                str += "<td>" + borObj[i].balance + "</td>>";
                str += "<td>" + borObj[i].createDate + "</td>>";
                let tr = $("<tr>" + str + "</tr>");
                $("#userInfo").append(tr);
            }
        });
    }

    getBorInfo();

</script>
